import React from 'react';
import './style.scss';

interface Props {
  dom: any;
}
/**策略项-单元-公共 */
export const StrategyItem = (props: Props) => {
  const { dom } = props;
  // todo-mock策略项数据，待接口定义出来再完善
  // const mock = [
  //   {
  //     callInterval: 60,
  //     callTimes: 1,
  //     strategies: [
  //       {
  //         strategyId: 1,
  //         strategyName: '呼叫结果',
  //         strategies: [
  //           {
  //             value: '1',
  //             key: '关机',
  //           },
  //           {
  //             value: '2',
  //             key: '通话中',
  //           },
  //           {
  //             value: '3',
  //             key: '未接通',
  //           },
  //         ],
  //       },
  //       // {
  //       //   strategyId: 2,
  //       //   strategyName: '用户地市',
  //       //   strategies: [
  //       //     {
  //       //       value: '1',
  //       //       key: '北京',
  //       //     },
  //       //     {
  //       //       value: '2',
  //       //       key: '河北',
  //       //     },
  //       //     {
  //       //       value: '3',
  //       //       key: '天津',
  //       //     },
  //       //   ],
  //       // },
  //       // {
  //       //   strategyId: 3,
  //       //   strategyName: '通话时长',
  //       //   strategies: [
  //       //     {
  //       //       value: '1',
  //       //       key: '0秒',
  //       //     },
  //       //     {
  //       //       value: '2',
  //       //       key: '1秒',
  //       //     },
  //       //     {
  //       //       value: '3',
  //       //       key: '2秒',
  //       //     },
  //       //   ],
  //       // },
  //     ],
  //   },
  //   {
  //     callInterval: 60,
  //     callTimes: 1,
  //     strategies: [
  //       {
  //         strategyId: 1,
  //         strategyName: '呼叫结果',
  //         strategies: [
  //           {
  //             value: '1',
  //             key: '关机',
  //           },
  //           {
  //             value: '2',
  //             key: '通话中',
  //           },
  //           {
  //             value: '3',
  //             key: '未接通',
  //           },
  //         ],
  //       },
  //       {
  //         strategyId: 2,
  //         strategyName: '用户地市',
  //         strategies: [
  //           {
  //             value: '1',
  //             key: '北京',
  //           },
  //           {
  //             value: '2',
  //             key: '河北',
  //           },
  //           {
  //             value: '3',
  //             key: '天津',
  //           },
  //         ],
  //       },
  //       {
  //         strategyId: 3,
  //         strategyName: '通话时长',
  //         strategies: [
  //           {
  //             value: '1',
  //             key: '0秒',
  //           },
  //           {
  //             value: '2',
  //             key: '1秒',
  //           },
  //           {
  //             value: '3',
  //             key: '2秒',
  //           },
  //         ],
  //       },
  //     ],
  //   },
  //   {
  //     callInterval: 60,
  //     callTimes: 1,
  //     strategies: [
  //       {
  //         strategyId: 1,
  //         strategyName: '呼叫结果',
  //         strategies: [
  //           {
  //             value: '1',
  //             key: '关机',
  //           },
  //           {
  //             value: '2',
  //             key: '通话中',
  //           },
  //           {
  //             value: '3',
  //             key: '未接通',
  //           },
  //         ],
  //       },
  //       {
  //         strategyId: 2,
  //         strategyName: '用户地市',
  //         strategies: [
  //           {
  //             value: '1',
  //             key: '北京',
  //           },
  //           {
  //             value: '2',
  //             key: '河北',
  //           },
  //           {
  //             value: '3',
  //             key: '天津',
  //           },
  //         ],
  //       },
  //       {
  //         strategyId: 3,
  //         strategyName: '通话时长',
  //         strategies: [
  //           {
  //             value: '1',
  //             key: '0秒',
  //           },
  //           {
  //             value: '2',
  //             key: '1秒',
  //           },
  //           {
  //             value: '3',
  //             key: '2秒',
  //           },
  //         ],
  //       },
  //     ],
  //   },
  //   {
  //     callInterval: 60,
  //     callTimes: 1,
  //     strategies: [
  //       {
  //         strategyId: 1,
  //         strategyName: '呼叫结果',
  //         strategies: [
  //           {
  //             value: '1',
  //             key: '关机',
  //           },
  //           {
  //             value: '2',
  //             key: '通话中',
  //           },
  //           {
  //             value: '3',
  //             key: '未接通',
  //           },
  //         ],
  //       },
  //       {
  //         strategyId: 2,
  //         strategyName: '用户地市',
  //         strategies: [
  //           {
  //             value: '1',
  //             key: '北京',
  //           },
  //           {
  //             value: '2',
  //             key: '河北',
  //           },
  //           {
  //             value: '3',
  //             key: '天津',
  //           },
  //         ],
  //       },
  //       {
  //         strategyId: 3,
  //         strategyName: '通话时长',
  //         strategies: [
  //           {
  //             value: '1',
  //             key: '0秒',
  //           },
  //           {
  //             value: '2',
  //             key: '1秒',
  //           },
  //           {
  //             value: '3',
  //             key: '2秒',
  //           },
  //         ],
  //       },
  //     ],
  //   },
  // ];
  return (
    <div className="strategy-item">
      {/* 自定义策略项 */}
      {dom.strategies?.map((item: any) => {
        return (
          <div className="list" key={item.strategyId}>
            <span>{item.strategyName}</span>
            {item.strategies?.map((innerItem: any) => {
              return (
                <span className="list-item" key={innerItem.value}>
                  {innerItem.key}
                </span>
              );
            })}
          </div>
        );
      })}
      {/* 通用策略项 */}
      <div className="list">
        <span>时间间隔</span>
        <span>{dom.callInterval}分钟</span>
      </div>
    </div>
  );
};
